var gulp         = require('gulp'),
    del          = require('del'),
    less         = require('gulp-less'),
    sourcemaps   = require('gulp-sourcemaps'),
    minifyCSS    = require('gulp-clean-css'),
    rename       = require('gulp-rename'),
    sequence     = require('gulp-sequence'),
    fileInclude  = require('gulp-file-include'),
    connect      = require('gulp-connect'),
    autoprefixer = require('gulp-autoprefixer'),
    replace      = require('gulp-replace')

/* 清空文件夹 */
gulp.task('clean', () => del('./dist/**/*'))

/* html */
gulp.task('html', () => {
  return (
    gulp.src(['./src/*.html', '!./src/template.html'])
      .pipe(fileInclude({
        prefix: '@@',
        basepath: './src/component'
      }))
      .pipe(gulp.dest('./dist/'))
      .pipe(connect.reload())
  )
})

/* js */
gulp.task('js', () => {
  return (
    gulp.src('./src/js/*.js')
      .pipe(gulp.dest('./dist/js'))
      .pipe(connect.reload())
  )
})

/* jsVendor */
gulp.task('jsVendor', () => {
  return (
    gulp.src('./src/js/vendor/*.js')
      .pipe(gulp.dest('./dist/js/vendor'))
      .pipe(connect.reload())
  )
})

/* font */
gulp.task('font', () => {
  return (
    gulp.src('./src/font/**')
      .pipe(gulp.dest('./dist/font'))
  )
})

/* img */
gulp.task('img', () => {
  return (
    gulp.src('./src/img/**')
      .pipe(gulp.dest('./dist/img'))
  )
})

/* less */
gulp.task('less', () => {
  return (
    gulp.src(['./src/less/bootstrap.less'])
      // .pipe(sourcemaps.init())
      .pipe(less())
      .pipe(autoprefixer({
        browsers: ['> 0.01%']
      }))
      // .pipe(sourcemaps.write())
      .pipe(gulp.dest('./dist/css'))
      .pipe(minifyCSS({
        advanced: false,
        compatibility: 'ie8',
        keepBreaks: true,
        keepSpecialComments: '*'
      }))
      .pipe(rename('bootstrap.min.css'))
      .pipe(gulp.dest('./dist/css'))
      .pipe(connect.reload())
  )
})

/* buildLess */
gulp.task('buildLess', () => {
  return (
    gulp.src(['./src/less/bootstrap.less'])
      .pipe(less())
      .pipe(autoprefixer({
        browsers: ['> 0.01%']
      }))
      .pipe(minifyCSS({
        advanced: false,
        compatibility: 'ie8',
        keepBreaks: true,
        keepSpecialComments: '*'
      }))
      .pipe(rename('bootstrap.min.css'))
      .pipe(gulp.dest('./dist/css'))
      .pipe(connect.reload())
  )
})

/* css */
gulp.task('css', () => {
  return (
    gulp.src('./src/css/*.css')
      .pipe(autoprefixer({
        browsers: ['> 0.01%']
      }))
      .pipe(gulp.dest('./dist/css/'))
      .pipe(minifyCSS({
        keepSpecialComments: '*'
      }))
      .pipe(rename((path) => {
        if (!/\.min$/.test(path.basename)) {
          path.basename += '.min'
        }
      }))
      .pipe(gulp.dest('./dist/css/'))
      .pipe(connect.reload())
  )
})

/* 服务器 */
gulp.task('connect', () => {
  connect.server({
    root: 'dist',
    livereload: true
  })
})


/* watch */
gulp.task('watch', () => {

  gulp.watch('src/img/**', ['img'])
  gulp.watch('src/less/**/*.less', ['less'])
  gulp.watch(['src/*.html', 'src/component/*.html'], ['html'])
  gulp.watch(['src/css/**/*.css'], ['css'])
  gulp.watch(['src/js/*.js'], ['js'])
  gulp.watch(['src/js/vendor/*.js'], ['jsVendor'])

})

gulp.task('build', ['clean'], () => {
  sequence('html', 'jsVendor', 'js', 'buildLess', 'css', 'font', 'img')()
})

gulp.task('default', ['clean'], () => {
  sequence('html', 'jsVendor', 'js', 'less', 'css', 'font', 'img', 'connect', 'watch')()
})